<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<div class="capacity-forecast-container" *ngIf="!cookieService.isCloudBackup">
  <h1 class="capacity-forecast-title">
    {{ 'protection_openstack_quota_label' | i18n }}
  </h1>
  <div class="capacity-forecast-chart-container">
    <div id="capacity-forecast-chart"></div>
    <div>
      <div class="capacity-nowrap margin-left-max margin-bottom-max">
        <div class="status-circle-display-indigo"></div>
        <span class="status-number-display">
          {{capacity.usedCapacity | capacityCalculateLabel: '1.1-3':unitconst.BYTE:true}}
        </span>
        <div class="status-label-display">{{'common_used_label' | i18n}}</div>
      </div>
      <div class="capacity-nowrap margin-left-max ">
        <div class="status-circle-display-gray"></div>
        <span class="status-number-display">
          {{capacity.freeCapacity | capacityCalculateLabel: '1.1-3':unitconst.BYTE:true}}
        </span>
        <div class="status-label-display">{{'common_unuse_label' | i18n}}</div>
      </div>
    </div>
  </div>
</div>
